* {
    margin: 0;
    padding: 0;
}
.px2rem(@name, @px) {
    @{name}: @px / 75 * 1rem;
}
.flexbox {
    display: flex;
    display: -webkit-flex;
}
li {
    list-style: none;
}
a {
    text-decoration: none;
}
body,
html {
    width: 100%;
    height: 100%;
}
.zouxiu-pl{
    .flexbox();
    width: 100%;
    .px2rem(line-height, 90);
    justify-content: center;
    align-items: center;
    color: white;
    background: linear-gradient(#f30000, #a70000);
    .span-pl{
      .px2rem(font-size, 39);    
    }
}
///////
//第三header
.header3-pl{
    .flexbox();
    background: linear-gradient(#f30000, #a70000);
    justify-content: space-around;
    align-items: center;
    .px2rem(height, 92);
    .fenlei-left{
        width: 3.2em;
        .px2rem(margin-left, 40);
        img{
            width: 50%;
        }
    }
    .fenlei-right{
        flex: 1;
        .flexbox();
    justify-content: center;
    align-items: center;
        .feilei-leftspan{
            width: 30%;
            .px2rem(margin-right, 152);
            text-align: center;
            border: none;
            color: #000;
            .px2rem(font-size, 30);
            .px2rem(line-height, 52);
            background: linear-gradient(#f6f6f6, #969696); 
            .px2rem(border-radius,15);          
        }
        .feilei-rightspan{
             width: 30%;
            .px2rem(margin-left, -93);
            text-align: center;
            border: none;
            color: #fff;
            .px2rem(font-size, 30);
            .px2rem(line-height, 52);
            background: linear-gradient(#f86f6f, #ad1919);
            .px2rem(border-radius,15); 
            
        }
    }
}
/////////
///四header////
.header4-pl{
    .flexbox();
    background: linear-gradient(#f30000, #a70000);
    justify-content: space-around;
    align-items: center;
    .px2rem(height, 92);
    .fenlei-lefta{
        width: 3.2em;
        .px2rem(margin-left, 40);
        img{
            width: 50%;
        }
    }
    .fenlei-righta{
        flex: 1;
        .flexbox();
        justify-content: center;
        align-items: center;
        .feilei-leftspana{
            width: 30%;
            .px2rem(margin-right, 152);
            text-align: center;
            border: none;
            color: #000;
            .px2rem(font-size, 30);
            .px2rem(line-height, 52);
            background: linear-gradient(#f86f6f, #ad1919);          
            .px2rem(border-radius,15);          
        }
        .feilei-rightspana{
             width: 30%;
            .px2rem(margin-left, -93);
            text-align: center;
            border: none;
            color: #fff;
            .px2rem(font-size, 30);
            .px2rem(line-height, 52);
             background: linear-gradient(#f6f6f6, #969696); 
            .px2rem(border-radius,15); 
            
        }
    }
}
////////
//五header
.header5-pl{
    .flexbox();
    justify-content: center;
    align-items: center;
    .px2rem(line-height, 90);
    background: linear-gradient(#f30000, #a70000);
    .fendiimg{
        width: 1.7em;
        .px2rem(margin-left, 20);
    }
    .fendip{
        flex: 1;
        text-align: center;
        color: #fff;
        .px2rem(font-size, 40);
    }
}
///////////////
///第八张header///
.header8-pl{
    .flexbox();
    justify-content: center;
    align-items: center;
    .px2rem(line-height, 90);
    background: linear-gradient(#f30000, #a70000);
    .fendiimg{
        width: 1.7em;
        .px2rem(margin-left, 20);
    }
    .fendip{
        flex: 1;
        text-align: center;
        color: #fff;
        .px2rem(font-size, 40);
    }
    .fendiimg1{
        width: 1.7em;
        .px2rem(margin-right, 20);
    }
}

.footerfendipl{
    position: fixed;
    left: 0;
    bottom: 0;
     width: 100%;
    ul{
    .flexbox();      
     .px2rem(height,99);
     background: #000;
     width: 100%;
    }
    li{
        flex-grow:1 ;
        width: 1px;
       .flexbox(); 
        justify-content: center;
        align-items: center;
        a{
            .flexbox(); 
            flex-direction: column;
            justify-content: center;
            align-items: center;
            color: #fff;
        }
        a:hover{
            .px2rem(width,98);
            .px2rem(height,91);
            .px2rem(border-radius,20);
            background: linear-gradient(#6f6f6f, #565656); 
        }
        img{
            display: block;
            .px2rem(width,59);
            .px2rem(height,40);
        }
    }
}
